<div class="sc_body">
    <div class="sc_title sc_body_title">
        <h5>{$nodeInfo.title}</h5>
        <div class="sc_title_btn">
            <button class="layui-btn layui-btn-sm" data-url="{:U('import')}?spm={$spm}"><i class="layui-icon">&#xe654;</i> 备份列表</button>
        </div>
    </div>
    <div class="fadeInUp animated">
        <div class="clearfix">
            <button class="layui-btn layui-btn-sm" id="export">立即备份</button>
            <button class="layui-btn layui-btn-sm" data-action="{:U('optimize')}">优化表</button>
            <button class="layui-btn layui-btn-sm" data-action="{:U('repair')}">修复表</button>
        </div>
        <form action="{:U('export')}" id="form-list" class="layui-form">
            <table class="layui-table">
                <colgroup>
                    <col width="50">
                    <col>
                    <col width="80">
                    <col width="120">
                    <col width="180">
                    <col width="120">
                </colgroup>
                <thead>
                    <tr>
                        <th>
                            <input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose" />
                        </th>
                        <th>表名</th>
                        <th>数据量</th>
                        <th>数据大小</th>
                        <th>创建时间</th>
                        <th>备份状态</th>
                    </tr>
                </thead>
                <tbody>
                    {volist name="list" id="data"}
                        <tr>
                            <td class="num">
                                <input type="checkbox" name="tables[]" value="{$data.name}" lay-skin="primary" checked />
                            </td>
                            <td>{$data.name}</td>
                            <td>{$data.rows}</td>
                            <td>{$data.data_length|format_bytes}</td>
                            <td>{$data.create_time}</td>
                            <td class="info">未备份</td>
                        </tr>
                    {/volist}
                </tbody>
            </table>
        </form>
    </div>
</div>
<script>
layui.use(['form'], function(){
    var form = layui.form;
    form.on('checkbox(allChoose)', function(data){
        var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]');
        child.each(function(index, item){
            item.checked = data.elem.checked;
        });
        form.render('checkbox');
    });
});
(function($){
    var $form = $("#form-list"),
        $export = $("#export"),
        tables,
        timer;
    $export.click(function(event){
        event.preventDefault();
        $export.parent().children().addClass("disabled");
        $export.html("正在发送备份请求...");
        $.post($form.attr("action"),$form.serialize(),function(data){
            if(data.code){
                tables = data.tables;
                $export.html(data.msg + "开始备份，请不要关闭本页面！");
                backup(data.tab);
                window.onbeforeunload = function(){ return "正在备份数据库，请不要关闭！" }
            }else{
                layer.open({
                    content: data.msg,
                    closeBtn: 0,
                    icon: 2,
                    btn:[],
                    success: function(a,b){
                        var i = 2;
                        var fn = function() {
                            layer.title(i + ' 秒后自动关闭。',b);
                            if(!i) {layer.close(b); return false;} i--;
                        };
                        var timer = setInterval(fn, 1000);
                        fn();
                    },
                    cancel: function(i){
                        return false;
                    },
                    end: function(){clearInterval(timer);}
                });
                $export.parent().children().removeClass("disabled");
                $export.html("立即备份");
                setTimeout(function(){
                    $(this).removeClass('disabled').prop('disabled',false);
                },1500);
            }
        },"json");
        return false;
    });
    function backup(tab, status){
        status && showmsg(tab.id, "开始备份...(0%)");
        $.get($form.attr("action"), tab, function(data){
            if(data.code){
                showmsg(tab.id, data.msg);
                if(!$.isPlainObject(data.tab)){
                    $export.parent().children().removeClass("disabled");
                    $export.html("备份完成，点击重新备份");
                    window.onbeforeunload = function(){ return null }
                    return;
                }
                backup(data.tab, tab.id != data.tab.id);
            } else {
                layer.open({
                    content: data.msg,
                    closeBtn: 0,
                    icon: 2,
                    btn:[],
                    success: function(a,b){
                        var i = 2;
                        var fn = function() {
                            layer.title(i + ' 秒后自动关闭。',b);
                            if(!i) {layer.close(b); return false;} i--;
                        };
                        var timer = setInterval(fn, 1000);
                        fn();
                    },
                    cancel: function(i){
                        return false;
                    },
                    end: function(){clearInterval(timer);}
                });
                $export.parent().children().removeClass("disabled");
                $export.html("立即备份");
                setTimeout(function(){
                    $(this).removeClass('disabled').prop('disabled',false);
                },1500);
            }
        }, "json");
    }
    function showmsg(id, msg){
        $form.find("input[value=" + tables[id] + "]").parents("tr").find(".info").html(msg);
    }
})(jQuery);
</script>
